<template>
  <section class="component entity-information">
    <ul class="overflow-hidden">
      <li
        class="float-left"
        v-for="{ value, label, index } in this.information"
        :key="index"
      >
        <span>{{ label }}：</span>
        <span>{{ value }}</span>
      </li>
    </ul>
  </section>
</template>

<script lang="ts">
import Vue from "vue";
import Component from "vue-class-component";
import { Dependencies } from "~/core/decorator";
import { CaseOperatorPageService } from "~/services/domain-service/case-operator-page.service";
import { namespace } from "vuex-class";
const CollectionExecutionModule = namespace("collection-execution");
@Component({
  components: {}
})
export default class EntityInformation extends Vue {
  @Dependencies(CaseOperatorPageService)
  private caseOperatorPageService: CaseOperatorPageService;
  @CollectionExecutionModule.State private caseId;

  private information: any = [
    {
      key: "entityTypeCode",
      label: "实体类型码",
      value: ""
    },
    {
      key: "entityId",
      label: "实体ID",
      value: ""
    },
    {
      key: "entityAccountNum",
      label: "实体账户数",
      value: ""
    },
    {
      key: "entityOverdueAccountNum",
      label: "实体逾期账户数",
      value: ""
    },
    {
      key: "entityOverdueCaseMoney",
      label: "实体逾期账户总金额",
      value: ""
    },
    {
      key: "entityGreZeroAccountNum",
      label: "实体下总金额>0的账户数",
      value: ""
    },
    {
      key: "entityShouldGreZeroAccountNum",
      label: "实体应还金额>0的账户数",
      value: ""
    },
    {
      key: "entityOverdueAmountGreZeroAccountNum",
      label: "实体逾期金额>0的账户数",
      value: ""
    },
    {
      key: "entityCaseMoney",
      label: "实体总金额",
      value: ""
    },
    {
      key: "entityOverdueAmount",
      label: "实体逾期金额",
      value: ""
    },
    {
      key: "entityUnexpiredAmount",
      label: "实体未到期金额",
      value: ""
    },
    {
      key: "entityMaxOverduePeriod",
      label: "实体最高逾期期数",
      value: ""
    },
    {
      key: "entityMinOverduePeriod",
      label: "实体最低逾期期数",
      value: ""
    },
    {
      key: "entityMaxOverduePeriodReason",
      label: "实体下最高逾期期数入催原因码",
      value: ""
    }
  ];
  private activated() {
    this.refreshData();
  }
  private refreshData() {
    this.caseOperatorPageService
      .queryCaseEntityInfo(this.caseId)
      .subscribe(data => {
        this.information.forEach(v => {
          switch (v.key) {
            case "entityOverdueCaseMoney":
            case "entityCaseMoney":
            case "entityUnexpiredAmount":
            case "entityOverdueAmount":
              v.value =
                data[v.key] && `${this.$filter.toThousands(data[v.key])}元`;
              break;
            case "entityMaxOverduePeriodReason":
              v.value = this.$filter.dictConvert(data[v.key], "ReasonCode");
              break;
            default:
              v.value = data[v.key];
              break;
          }
        });
      });
  }
}
</script>
<style lang="less">
.component.entity-information {
  padding: 0px 5px 0px 0px;
  .padding-bottom-8 {
    padding-bottom: 8px;
    .name {
      color: #606266;
    }
  }
  ul {
    padding: 0;
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    li {
      width: 32%;
      font-size: 12px;
      list-style: none;
      padding-bottom: 10px;
    }
  }
}
</style>
